/**
 * @author deming.su
 * @date 2022-02-24
 * @description 进行路由配置定义和路由拦截、路由插件全局拦截
 */
// 路由插件注册
import Vue from 'vue'
import Router from 'vue-router'
// vuex导入
import store from '../store'

// 路由插件注册使用
Vue.use(Router)

// 引入路由页面组件 
import NotFound from '../views/common/NotFound'
import Login from '../views/login'
import Register from '../views/login/Register.vue'
import Home from '../views/home'

// 路由实例化 和 路由模式指定 路由配置
const meta = { noLogin: true }
const router = new Router({
    // 路由模式
    mode: 'history',
    // 路由配置
    routes: [
        // 默认路由
        { path: '/', redirect: '/login' },
        // 正常页面路由
        { path: '/login', component: Login, meta },
        { path: '/register', component: Register, meta: { noLogin: true } },
        { path: '/home', component: Home },
        // 如果用户输入了一个不存在的地址，如何处理？-- 所有的路由都没有匹配上，那么这个就是最后的选择
        { path: '*', component: NotFound, meta: { noLogin: true } }
    ]
})

// 做用户登录拦截
router.beforeEach(function(to, from, next) {

    // 判断要去的页面是否需要登录 -- 取meta值
    let noLogin = to.meta.noLogin
        // 如果不需要登录，那么直接跳转业务
    if (noLogin) {
        next()
    } else {
        // 如果需要登录，先取缓存数据，然后判断缓存数据是否存在
        // let token = sessionStorage.getItem('token')
        // 应该取vuex中的数据才是正式业务的做法 -- 因为是全局注入了store才有的this.$store，this.$store实际上就是store模块实例对象
        // 所以可以直接引入store模块，直接使用它的方法
        // 因为这里是使用vuex数据，所以登录的时候，需要把token数据缓存到vuex中去
        const token = store.getters['common/getToken']

        // 如果存在则执行跳转业务，否则重定向到登录页面--/login
        if (!!token) {
            next()
        } else {
            // 执行重定向
            next('/login')
        }
    }
})
export default router